<template>
	<view class="uiwu">
		<view class="uiwu-goods uiwu-flex-align">
			<view class="image">
				<image :src="items.image" mode="aspectFill"></image>
				<text>共1件商品</text>
			</view>
			<view class="info">
				<view class="title">物流公司：{{items.express_name}}</view>
				<view class="tips uiwu-flex-align">快递单号：{{items.express}} <text @tap="uiwu.copy(items.express)">复制</text></view>
			</view>
		</view>
		<view class="uiwu-list">
			<view class="item">
				<image src="/static/liucheng3.png" mode="widthFix"></image>
				<view class="in uiwu-flex-column">
					<text class="title">{{items.real_name}}  {{items.user_phone}}</text>
					<view class="tips">{{items.user_address}}</view>
				</view>
			</view>
			<view class="item" v-for="(item,index) in items.logistics" :key="index">
				<image src="/static/liucheng2.png" mode="widthFix"></image>
				<view class="in uiwu-flex-column">
					<!-- <text class="title">已发货</text> -->
					<view class="tips">{{item.AcceptStation}}</view>
					<view class="time">{{item.AcceptTime}}</view>
				</view>
			</view>
			<view class="item">
				<image src="/static/liucheng1.png" mode="widthFix"></image>
				<view class="in uiwu-flex-column">
					<text class="title">已下单</text>
					<view class="tips">订单提交成功</view>
					<view class="time">{{uiwu.formatTimestamp(items.add_time * 1000)}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script lang="ts" setup>
	import { onLoad } from '@dcloudio/uni-app';
	import { uiwu } from '@/config/config';
	import { ref } from "vue";
	import { integralOrderDetail } from '@/api/api';
	import { prizeinfo } from '@/api/prize';
	const items = ref({})
	const getintegralOrderDetail = async (id:string|number) : Promise<any> => {
		const { data } = await integralOrderDetail(id);
		items.value = data
	}
	const getPrizeinfo = async (id:string|number) : Promise<any> => {
		const { data } = await prizeinfo(id);
		items.value = data
	}
	onLoad(({id,type})=>{
		if(type){
			getPrizeinfo(id)
		}else{
			getintegralOrderDetail(id)
		}
	})
</script>

<style lang="scss">
	page{
		background-color: #f6f6f6;
	}
	.uiwu{
		padding: 20rpx;
	}
	.uiwu-goods{
		width: 100%;
		height: 208rpx;
		background: #FFFFFF;
		border-radius: 16rpx;
		.image{
			width: 160rpx;
			height: 160rpx;
			border-radius: 16rpx;
			position: relative;
			image{
				width: 100%;
				height: 100%;
				border-radius: 16rpx;
			}
			text{
				position: absolute;
				left: 0;
				right: 0;
				bottom: 0;
				width: 100%;
				height: 42rpx;
				border-radius: 21rpx;
				background: rgba(0,0,0,.5);
				font-size: 24rpx;
				font-weight: 500;
				color: #FFFFFF;
				text-align: center;
				line-height: 42rpx;
			}
		}
		.info{
			flex: 1;
			margin-left: 24rpx;
			.title{
				font-size: 28rpx;
				font-weight: bold;
				color: #231815;
			}
			.tips{
				font-size: 24rpx;
				font-weight: 500;
				color: #666666;
				margin-top: 24rpx;
				text{
					font-size: 24rpx;
					font-weight: 500;
					margin-left: 52rpx;
					color: #EF821E;
				}
			}
		}
	}
	.uiwu-list{
		background-color: #fff;
		margin-top: 20rpx;
		padding: 15rpx 24rpx;
		border-radius: 16rpx;
		.item{
			display: flex;
			padding: 15rpx 0;
			image{
				width: 48rpx;
				margin-right: 20rpx;
			}
			.in{
				flex: 1;
				.title{
					font-size: 28rpx;
					font-weight: bold;
					color: #231815;
				}
				.tips{
					margin-top: 6rpx;
					font-size: 28rpx;
					font-weight: 500;
					color: #666666;
				}
				.time{
					font-size: 24rpx;
					font-weight: 300;
					color: #666666;
				}
			}
		}
	}
</style>
